<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0, user-scalable=no" />
		<title>{{title}}</title>
		<link rel="stylesheet" href="../statics/nexmoe/css/forkGh.css" />
		<!--Safari浏览器-->
		<link rel="apple-touch-icon" sizes="64x64" href="{{title}}">
		<!--Chrome等浏览器-->
		<link rel="icon" href="../statics/nexmoe/img/OneIndexM.svg">
		<script src="https://cdn.jsdelivr.net/npm/flv.js@1.5.0/dist/flv.min.js"></script>

		<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.css">
		<script src="https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.js"></script>
		<script src="https://cdn.jsdelivr.net/npm/meting@2/dist/Meting.min.js"></script>
		<link rel="stylesheet" href="//cdnjs.loli.net/ajax/libs/mdui/0.4.3/css/mdui.min.css">
		<style>
			body {
				background-color: #fff;
				{% if background_img==""%}
					background-image:url('../static/neo/IMG/background.jpeg') !important;
				{% else %}
					background-image:url({{ background_img }}) !important;
				{% endif %}
				padding-bottom: 60px;
				background-position:auto !important;
				background-size: cover !important;
				background-attachment: fixed !important;
				background-repeat: no-repeat !important;
			}

			.nexmoe-item {
				margin: 20px -8px 0 !important;
				padding: 15px !important;
				border-radius: 5px;
				background-color: #fff;
				-webkit-box-shadow: 0 .5em 3em rgba(161, 177, 204, .4);
				box-shadow: 0 .5em 3em rgba(161, 177, 204, .4);
				background-color: #fff
			}

			.mdui-img-fluid,
			.mdui-video-fluid {
				border-radius: 5px;
				border: 1px solid #eee
			}

			.mdui-list {
				padding: 0
			}

			.mdui-list-item {
				margin: 0 !important;
				border-radius: 5px;
				padding: 0 10px 0 5px !important;
				border: 1px solid #eee;
				margin-bottom: 10px !important
			}

			.mdui-list-item:last-child {
				margin-bottom: 0 !important
			}

			.mdui-list-item:first-child {
				border: none
			}

			.mdui-toolbar {
				width: auto;
				margin-top: 1rem !important
			}

			.mdui-appbar .mdui-toolbar {
				height: 1rem;
				font-size: 16px
			}

			.mdui-toolbar>* {
				padding: 0 6px;
				margin: 0 2px;
				opacity: .5
			}

			.mdui-toolbar>.mdui-typo-headline {
				padding: 0 16px 0 0
			}

			.mdui-toolbar>i {
				padding: 0
			}

			.mdui-toolbar>a:hover,
			a.mdui-typo-headline,
			a.active {
				opacity: 1
			}

			.mdui-container {
				max-width: 980px
			}

			.mdui-list>.th {
				background-color: initial
			}

			.mdui-list-item>a {
				width: 100%;
				line-height: 48px
			}

			.mdui-toolbar>a {
				padding: 0 16px;
				line-height: 30px;
				border-radius: 30px;
				border: 1px solid #eee
			}

			.mdui-toolbar>a:last-child {
				opacity: 1;
				background-color: #1e89f2;
				color: #ffff
			}

			@media screen and (max-width:980px) {
				.mdui-list-item .mdui-text-right {
					display: none
				}

				.mdui-container {
					width: 100% !important;
					margin: 0
				}

				.mdui-toolbar>* {
					display: none
				}

				.mdui-toolbar>a:last-child,
				.mdui-toolbar>.mdui-typo-headline,
				.mdui-toolbar>i:first-child {
					display: block
				}
			}
		</style>
		<script src="https://cdn.jsdelivr.net/gh/xieqifei/StaticsResources/oneindexn/mdui/mdui.min.js"></script>
	</head>
	<body class="mdui-theme-primary-blue-grey mdui-theme-accent-blue">
		<div class="mdui-container">
			<div class="mdui-container-fluid">
				<div class="mdui-toolbar nexmoe-item">
					<a>{{name}}</a>
										<i class="mdui-icon material-icons mdui-icon-dark" style="margin:0;">chevron_right</i>
                    {% for i in index_list %}
						{% if i != "" %}
					        <a>/</a>
                            <i class="mdui-icon material-icons mdui-icon-dark" style="margin:0;">chevron_right</i>
                            <a>{{i}}</a>
                        {% if i!=index_list[-2] %}
                            <i class="mdui-icon material-icons mdui-icon-dark" style="margin:0;">chevron_right</i>
                        {% endif %}
                        {% elif index_list[0] == "" %}
                            <a>/</a>
                        {% endif %}
                    {% endfor %}
										<!--<a href="javascript:;" class="mdui-btn mdui-btn-icon"><i class="mdui-icon material-icons">refresh</i></a>-->
				</div>
			</div>




<div class="mdui-container-fluid">
<style>
.thumb .th{
	display: none;
}
.thumb .mdui-text-right{
	display: none;
}
.thumb .mdui-list-item a ,.thumb .mdui-list-item {
	width:217px;
	height: 230px;
	float: left;
	margin: 10px 10px !important;
}

.thumb .mdui-col-xs-12,.thumb .mdui-col-sm-7{
	width:100% !important;
	height:230px;
}

.thumb .mdui-list-item .mdui-icon{
	font-size:100px;
	display: block;
	margin-top: 40px;
	color: #7ab5ef;
}
.thumb .mdui-list-item span{
	float: left;
	display: block;
	text-align: center;
	width:100%;
	position: absolute;
    top: 180px;
}
/*loading动画*/
.simple-spinner {
  height: 100%;
  border: 8px solid rgba(150, 150, 150, 0.2);
  border-radius: 50%;
  border-top-color: rgb(150, 150, 150);
  animation: rotate 1s 0s infinite ease-in-out alternate;
}
@keyframes rotate {
  0%   { transform: rotate(0);      }
  100% { transform: rotate(360deg); }
}
</style>
<div class="nexmoe-item" style="opacity:0.8;">
	<div class="mdui-row">
		<ul class="mdui-list">
			<li class="mdui-list-item th" id="indexsort">

			<div class="mdui-col-xs-12 mdui-col-sm-7">文件 <i class="mdui-icon material-icons icon-sort" data-sort="name" data-order="downward">expand_more</i></div>
			<div class="mdui-col-sm-3 mdui-text-right">修改时间 <i class="mdui-icon material-icons icon-sort" data-sort="date" data-order="downward">expand_more</i></div>
			<div class="mdui-col-sm-2 mdui-text-right">大小 <i class="mdui-icon material-icons icon-sort" data-sort="size" data-order="downward">expand_more</i></div>
			{% if index != "/"%}
                </li>
                            <li class="mdui-list-item mdui-ripple" id="backtolast">
                    <a href="{{ up_file }}">
                    <div class="mdui-col-xs-12 mdui-col-sm-7">
                        <i class="mdui-icon material-icons">arrow_upward</i>
                        ..
                    </div>
                    <div class="mdui-col-sm-3 mdui-text-right"></div>
                    <div class="mdui-col-sm-2 mdui-text-right"></div>
                    </a>
                </li>
            {% endif %}

			<li class="mdui-list-item mdui-ripple filter" id="pending" style="display:none;"><div class="simple-spinner" id="loading"></div>文件加载中~~~
			</li>

            {% for i in file %}
                {% if i["type"] != "path" %}
                    <li class="mdui-list-item file mdui-ripple filter">
                        <div class="simple-spinner loading-gif" style="display: none;"></div>

                        <a href="/preview{{ i['url'] }}" target="_blank">
                        <div class="mdui-col-xs-12 mdui-col-sm-7 mdui-text-truncate">
                            <i class="mdui-icon material-icons">insert_drive_file</i>
                            <span>{{ i["name"] }}</span>
                        </div>
                        <div class="mdui-col-sm-3 mdui-text-right">{{ i["date"] }}</div>
                        <div class="mdui-col-sm-2 mdui-text-right">{{ i["size"] }}</div>
                        </a>
                    </li>
                {% else %}

                    <li class="mdui-list-item mdui-ripple filter" >
                        <div class="simple-spinner loading-gif" style="display: none;"></div>

                        <a href="/?{{ i['url'] }}">
                        <div class="mdui-col-xs-12 mdui-col-sm-7 mdui-text-truncate">
                            <i class="mdui-icon material-icons">folder_open</i>
                            <span>{{ i["name"] }}</span>
                        </div>
                        <div class="mdui-col-sm-3 mdui-text-right">{{ i["date"] }}</div>
                        <div class="mdui-col-sm-2 mdui-text-right">{{ i["size"] }}</div>
                        </a>
                    </li>
                {% endif %}
            {% endfor %}


						</ul>
	</div>
</div>
</div>







<!-- <script src="https://cdn.jsdelivr.net/gh/xieqifei/OneindexN@v1.31/statics/js/nexmoe.js"></script> -->

<script src="https://code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
<script src="//cdnjs.loli.net/ajax/libs/mdui/0.4.3/js/mdui.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/clipboard.js/2.0.6/clipboard.min.js"></script>

		</div>
		<meting-js server="netease" type="playlist" id="3136952023" fixed="true">
		</meting-js>
		<!-- id改成自己的歌单号 -->
		<script src="https://cdn.jsdelivr.net/gh/Mintimate/OneIndex-theme-nexmoes@latest/nexmoes/theme/personjs.js">
		</script>
		<script src="../statics/nexmoe/js/nexmoe.js"></script>

	</body>

</html>

